import { defineStore } from 'pinia'

// 定义并导出容器
// 参数1：容器的ID，必须唯一，将来Pinia会把所有的容器挂载到根容器
// 参数2：选项对象
export const useCounterStore = defineStore('counter', {
  /**
   * 类似于组件的data，用来存储全局状态
   * 1、必须是函数：这样是为了在服务端渲染的时候避免交叉请求导致的数据状态污染
   * 2、必须是箭头函数，这样是为了更好的TS类型推导
   */
  state: () => {
    return {
      count: 0,
      name: 'Eduardo'
    }
  },

  /**
   * 类似于组件的computed，用来封装计算属性，有缓存的功能
   */
  getters: {
    doubleCount: (state) => state.count * 2,
    // 使用this获取state中的数据，这时候必须指定函数的返回值类型
    doubleCountPlusOne(): number {
      // 调用其他getter
      return this.doubleCount + 1
    }
  },

  /**
   * 类似于组件的methods，封装业务逻辑，修改state
   */
  actions: {
    // 同步方法
    increment() {
      this.count++
    },
    // 异步方法
    async asyncIncrement() {
      await new Promise(resolve => setTimeout(resolve, 1000))
      this.count++
    }
  }
})